About this website
How was this site constructed?
I wrote the basic structure of every page in this site
using HTML, JavaScript, CSS, and HaimML (see below). All of the articles to the
right of the navigation menu however were written in Microsoft Word which were
then saved as HTML files. Some of the page sources was built from standard
examples I found on www.w3schools.com.
The photo gallery in the “Adventures” page was constructed using the “Lightbox
CSS Gallery” example found at https://usejquery.com/css/css-gallery.
What’s HaimML?
HaimML is a language that I created that integrates
with HTML, CSS, and JavaScript. It’s interpreted by my “HaimML interpreter”
program that looks for all HaimML functions sitting inside a file and executes
their purpose by replacing them with appropriate HTML, CSS, and JavaScript
code. The most important function that this language features is the function
“InsertNavMenu” which looks for all of the html files in the root directory of
the webpage (including subdirectories) and inserts the html code for a navigation
menu to all of them. You can see an example of such a generated navigation menu
to the left of this text. That eliminates my need to maintain a separate file
that keeps a record of all the pages in my website.
HaimML Specifications
HaimML is interpreted by my “HaimML interpreter”
program. Every HaimML project is configured by a “build settings” xml file
where you can set various settings for how all of the HaimML functions will be
interpreted.
The procedure for how HaimML gets interpreted by my
program is the following:
1) First
the program goes to the folder that contains all of the site’s code and assets
(path to which is set in the “build settings” xml) and copies it into a build
folder that it precleans (path to which is also set in “build settings”).
2) Then
the program opens up all “.html” files (or “.htm”) and executes all HaimML
functions. After that, a few small technical steps:
a. The
“index” link in the top most directory of the navigation menu (which refers to
a page such as “index.html”) has its text replaced with “Home.”
b. Then
any prefixes of “index.html” in the topmost directory is deleted. For example,
if the file was called “A&index.html” (see below for an explanation of the
prefix “A&”), its name will be replaced by “index.html”
3) Lastly,
the program goes through and deletes all files and folders in the build folder
(and its subdirectories) that have a “remove ending,” which are set in “build
settings.” For example, I’ve set “_R” as a “remove ending” and so any file or
folder such as “SampleFile_R.html” or “SampleFolder_R” gets deleted. The
purpose of this is to remove any content that isn’t used in the end result and
that just takes up space.
After it’s done, all of the files in the build folder
are ready to be given to the service hosting your website.
A note:
§ The
program will not look for HaimML functions to execute in directories or files
that have “remove endings” since that would be pointless as those directories
and files will get removed at the end.
The following is a list of all HaimML functions that
I’ve created so far with their descriptions (The HaimML functions themselves
disappear in the final product):
· HaimSiteFunctions.InsertNavMenu: This function goes through all html
files in the directory that contains all of the site content (path to which set
in “build settings”) and inserts the html code for a nested unordered list of
links to the various html pages (i.e. the navigation menu).
o
In “build
settings” you can specify endings to files or folders that notifies this search
that it needs to ignore them. For example, I set “_I” to be one of my ignore
endings and so a file or folder such as “SamplePage_I.html” or “SampleFolder_I”
will be ignored in this navigation menu construction.
o
To specify the
order in which pages or folders should appear in the navigation menu, you can
add a sequence of letters and then the “&” symbol as a prefix to the name
of the file or folder. The ordering is then done alphabetically based on that
prefix. For example, if I have the files “A&Intro.html”
“B&Updates.html” and “C&Credits.html” then their order in the
navigation menu will appear as first “Intro,” then “Updates,” and finally
“Credits.” As you can see, the prefix “…&” gets erased from the name that
is placed into the navigation menu.
· HaimSiteFunctions.InsertLiftDir: This function inserts enough “../”
to get the path up to the root directory. For example, if the page is located
in the directory “/SampleFolder/SampleSubfolder,” then this function inserts
“../../” Two copies of “../” because this file is two subdirectories deep.
· (HaimSiteFunctions.InsertCurrentPageName): This function inserts
the name of the current html file. For example, “A&Intro.html” and
“Updates.html” give “A&Intro” and “Updates” respectively (note that the
prefix “A&” was preserved in the first case).
· (HaimSiteFunctions.InsertCurrentPageNameWithoutOrderPrefix):
This function inserts the name of the html file without any “…&” prefix
that it may have, such as the type described above. For example,
“A&Intro.html” and “Updates.html” give “Intro” and “Updates” respectively.
· HaimSiteFunctions.InsertHTMLPage(“Insert Path”):
This function inserts the text in the file with the path that’s placed in the
quotation marks in this function.
· HaimSiteFunctions.InsertDate: This function inserts today’s date.
· HaimSiteFunctions.DeleteAllHtmlComments: This function deletes
all html comments “<!-- … -->” in the current file except those which
have the HaimML protect command sitting inside of them (see next function).
However, this function does not delete any text of the form “<!-- …
-->” sitting inside of “<style>…</style>” or
“<script>…</script>” tags because those by convention are still
read by the browser (see this
and this
stack exchange answer for good explanations for why). This function is executed
after all other HaimML functions are executed.
· HaimSiteFunctions.ProtectHtmlComment: If you place this
function into an html comment, then it will prevent it from being deleted by
the HaimML “delete all html comments” command (see previous function).
Example of HaimML
An example of a page source that uses HaimML is the
following code that was used to build my “Book Review” page:
Name of File:
B&Book Review.html
Source:
<!DOCTYPE
html>
<html lang="en">
HaimSiteFunctions.DeleteAllHtmlComments
<head>
<title>(HaimSiteFunctions.InsertCurrentPageNameWithoutOrderPrefix)</title>
<link rel="stylesheet" href="HaimSiteFunctions.InsertLiftDir/NavMenuStyle.css">
<link rel="stylesheet" href="HaimSiteFunctions.InsertLiftDir/StandardPageStyle.css">
</head>
<body>
<!-- HaimSiteFunctions.ProtectHtmlComment Math is Awesome! -->
<div class="sidenav">
HaimSiteFunctions.InsertNavMenu
</div>
<script src="HaimSiteFunctions.InsertLiftDir/NavMenuToggler.js"></script>
<div class="main">
HaimSiteFunctions.InsertHTMLPage("(HaimSiteFunctions.InsertCurrentPageName)_Article_R.html")
<br>
<iframe class="PDF_ShowerIframe" src="Z_PDF_Documents_I/Letter
to Dr Paul J. Nahin (Final Version).pdf"></iframe>
</div>
</body>
</html>
Update and Release
I plan to do an update on HaimML sometimes in the
future. Things that I want to change include shortening my function names, make
more use of parameters, think more carefully about what order HaimML functions
should be executed in, etc. After that I plan to release this language on
GitHub alongside an example website project that uses HaimML.